<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的收藏</title>
    <link rel="stylesheet" type="text/css" href="../../../css/aui/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/html/order/get_work_frm.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/html/my/mycollect/mycollect.css" />
    <style>

    </style>
</head>

<body>
    <div id="app" v-clock>
        <div class="tab_nav">
            <div class="aui-tab border_b" id="tab">
                <div class="aui-tab-item aui-active">工人</div>
                <div class="aui-tab-item">工作</div>
                <div class="aui-tab-item">商品</div>
            </div>
        </div>
        <div id="tab-item-content">
            <!-- 工人 -->
            <div class="tab-content" v-if="listType===1">
                <div v-for="o,i in list.workerList" style="border-bottom:1px solid #eeeeee;margin-bottom:1rem;">
                    <div class="aui-list" @click="openWorker(o)">
                        <div class="aui-list-item">
                            <div class="aui-list-item-inner">
                                <div class="aui-list-item-title aui-ellipsis-1">{{o.user_introduction}}</div>
                            </div>
                        </div>
                        <div class="aui-list-item">
                            <div class="aui-media-list-item-inner">
                                <div class="aui-list-item-media">
                                    <img :src="o.headimgurl" onerror='this.src="../../../image/portrait.png"'>
                                </div>
                                <div class="person_info">
                                    <div> <img src="../../../image/icon/menu02-1.png" class="iconimg" alt=""> <span>联系人：{{o.user_name}}</span></div>
                                    <div> <img src="../../../image/icon/daohang.png" class="iconimg" alt=""> <span>项目地点：{{o.region}}</span></div>
                                    <div>
                                        <img src="../../../image/icon/time.png" class="iconimg" alt="">
                                        <span class="huizhang" v-if="o.is_work===0" style="background:#0689FB;">找活中</span>
                                        <span class="huizhang" v-if="o.is_work===1" style="background:#ff8500;">忙碌中</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="btn-group">
                        <div v-if="o.is_status!=1" class="failure">已失效</div>
                        <div class="btn" @click="cancelCollect(o,i)">取消收藏</div>
                    </div>
                </div>
            </div>
            <!-- 工作 -->
            <div class="tab-content" v-if="listType===2">
                <div v-for="o,i in list.workList" style="border-bottom:1px solid #eeeeee;margin-bottom:1rem;">
                    <div class="aui-list" @click="openWork(o)">
                        <div class="aui-list-item">
                            <div class="aui-list-item-inner">
                                <div class="aui-list-item-title aui-ellipsis-1">{{o.title}}</div>
                            </div>
                        </div>
                        <div class="aui-list-item">
                            <div class="aui-media-list-item-inner">
                                <div class="aui-list-item-media">
                                    <img :src="o.headimgurl" onerror='this.src="../../../image/portrait.png"'>
                                </div>
                                <div class="person_info" style="width:100%;">
                                    <div> <img src="../../../image/icon/menu02-1.png" class="iconimg" alt=""> <span>联系人：{{o.contact}}</span></div>
                                    <div> <img src="../../../image/icon/daohang.png" class="iconimg" alt=""> <span>项目地点：{{o.region}}</span></div>
                                    <div> <img src="../../../image/icon/time.png" class="iconimg" alt=""> <span>发布时间：{{o.work_date}}</span></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="btn-group">
                        <div v-if="o.is_status!=1" class="failure">已失效</div>
                        <div class="btn" @click="cancelCollect(o,i)">取消收藏</div>
                    </div>
                </div>
            </div>
            <!-- 商品 -->
            <div class="tab-content" v-if="listType===3" style="margin:0;padding:0.75rem;">
                <div v-for="o,i in list.goodsList" class="goodslist">
                    <div class="goodsPic" @click="openWin('commodity_details',{id:o.goods_id})">
                        <img :src="o.pic">
                    </div>
                    <div class="goodsInfo">
                        <div style="font-size:0.8rem;" @click="openWin('commodity_details',{id:o.goods_id})">{{o.name}}</div>
                        <div style="color:#DA2224;">￥<em style="font-size:1rem;">{{o.price}}</em></div>
                        <div class="btn" style="" @click="cancelCollect(o,i)">取消收藏</div>
                    </div>
                    <!-- <div class="row-flex">
                        <div class="list_item_media" @click="openWin('commodity_details')">
                            <img :src="o.pic">
                        </div>
                        <div class="person_info">
                            <div style="font-size:0.6rem;" @click="openWin('commodity_details')">{{o.name}}</div>
                            <div class="row-flex">
                                <span style="color:#DA2224;">
                                ￥<em style="font-size:1rem;">{{o.price}}</em>
                              </span>
                            </div>

                        </div>
                    </div>
                    <div style="text-align:right;">
                        <div class="btn" style="display:inline-block;" @click="cancelCollect(o,i)">取消收藏</div>
                    </div> -->
                </div>

            </div>
        </div>
    </div>
</body>
<script src="../../../script/api.js" charset="utf-8"></script>
<script src="../../../script/aui/aui-tab.js" charset="utf-8"></script>
<script src="../../../script/common/jquery-3.3.1.min.js" charset="utf-8"></script>
<script src="../../../script/common/common.js" charset="utf-8"></script>
<script src="../../../script/common/config.js" charset="utf-8"></script>
<script src="../../../script/common/vue.min.js" charset="utf-8"></script>
<script>
    apiready = function() {
        api.parseTapmode();
        vm.init();

    }

    var vm = new Vue({
        el: "#app",
        data: {
            userInfo: {},
            list: {
                workerList: [],
                workList: [],
                goodsList: [],
            },
            listType: 1,
            listPage: 1,
            listStatus: true,
        },
        methods: {
            init() {
                this.userInfo = get_local("userInfo");
                this.tabChange();
                this.upDownLoad();
                this.getList();
            },
            getList() {
                var that = this;
                var obj = ['workerList', 'workList', 'goodsList'];
                var urls = {
                    1: Config.api.UserCollectWorkerLists,
                    2: Config.api.UserCollectWorkLists,
                    3: Config.api.UserCollectGoodsLists,
                };
                var data = {
                    user_id: that.userInfo.user_id,
                    pages: this.listPage
                };
                _ajax(urls[that.listType], data, function(ret) {
                    if (ret.code === 200) {
                        if (that.listPage === 1) {
                            that.list[obj[that.listType - 1]] = ret.data;
                        } else {
                            if (ret.data.length > 0) {
                                that.list[obj[that.listType - 1]] = that.list[obj[that.listType - 1]].concat(ret.data);
                            } else {
                                that.listStatus = false;
                            }
                        }
                    }
                });
            },
            openWorker(o) {
                if (o.is_status != 1) {
                    return false;
                }
                var winInfo = {
                    name: 'homepage_win',
                    url: '../../look_for_workers/homepage/homepage_win.html',
                    pageParam: {
                        id: o.user_id,
                    }
                };
                open_w(winInfo.name, winInfo.url, winInfo.pageParam);
            },
            openWork(o) {
                if (o.is_status != 1) {
                    return false;
                }
                var winInfo = {
                    // name: 'demand_details_win',
                    // url: '../../details/demand_details_win.html',

                    name: 'particulars_win',
                    url: '../../home/bus_res/specialty/particulars_win.html',
                    pageParam: {
                        id: o.work_id
                    }
                };
                open_w(winInfo.name, winInfo.url, winInfo.pageParam);
            },
            cancelCollect(o, index) {
                var that = this;
                var obj = ['workerList', 'workList', 'goodsList'];
                var data = {
                    user_id: that.userInfo.user_id,
                    collect_id: o.collect_id
                };
                var urls = {
                    1: Config.api.UserCollectCancelWorker,
                    2: Config.api.UserCollectCancelWork,
                    3: Config.api.UserCollectCancelGoods,
                };
                _ajax(urls[that.listType], data, function(ret) {
                    if (ret.code === 200) {
                        that.list[obj[that.listType - 1]].splice(index, 1);
                        $toast("取消收藏成功");
                    }
                });
            },
            tabChange() {
                var that = this;
                var tab = new auiTab({
                    element: document.getElementById("tab"),
                    index: 1,
                    repeatClick: false
                }, function(ret) {
                    that.listType = ret.index;
                    that.listPage = 1;
                    that.listStatus = true;
                    that.getList();
                });
            },
            upDownLoad() {
                var that = this;

                // 下拉刷新
                push_down(function() {
                    //下拉刷新恢复
                    push_down_over();
                    that.listStatus = true;
                    that.listPage = 1;
                    that.getList();
                });

                //上拉加载
                push_up(function() {
                    if (that.listStatus) {
                        that.listPage++;
                        that.getList();
                    }
                });
            },
            openWin(name, o) {
                var winInfo = {
                    to_quote: {
                        name: 'to_quote_win',
                        url: './to_quote_win.html'
                    },
                    release_progress: {
                        name: 'release_progress_win',
                        url: './release_progress_win.html'
                    },
                    comment_details: {
                        name: 'comment_details_win',
                        url: './comment_details_win.html'
                    },
                    homepage: {
                        name: 'homepage_win',
                        url: '../../look_for_workers/homepage/homepage_win.html'
                    },
                    // 专业用工详情
                    specialty_particulars: {
                        name: 'particulars_win',
                        url: '../../home/bus_res/specialty/particulars_win.html',
                        pageParam: o
                    },
                    // 零工详情
                    odd_job_particulars: {
                        name: 'particulars_win',
                        url: '../../home/bus_res/odd_job/particulars_win.html'
                    },
                    // 商品详情
                    commodity_details: {
                        name: 'particulars_win',
                        url: '../../home/shop_res/commodity_details_win.html',
                        pageParam: o
                    }
                };
                if (name) {
                    open_w(winInfo[name].name, winInfo[name].url, winInfo[name].pageParam);
                } else {
                    $toast("正在开发中...");
                }
            }
        }
    });
</script>

</html>
